import moment from 'moment';

const option = {
  menuPosition: 'right',
  submitBtn: false,
  emptyBtn: false,
  column: [
    {
      label: '车间',
      prop: 'workshopId',
      filterable: true,
      multiple: false,
      disabled: false,
      props: {
        label: 'name',
        value: 'id'
      },
      dicUrl: '/api/mes-product/workshop/page?current=1&size=100000',
      dicFormatter: (res) => {
        return res.data.records || [];
      },
      type: 'select',
      span: 6
    },
    {
      label: '产线',
      prop: 'lineId',
      filterable: true,
      multiple: false,
      disabled: false,
      props: {
        label: 'name',
        value: 'id'
      },
      dicUrl: '/api/mes-product/product/line/page?current=1&size=10000',
      dicFormatter: (data) => {
        return data.data.records || [];
      },
      type: 'select',
      span: 6
    },
    {
      label: '产品编码',
      prop: 'productPartNo',
      disabled: false,
      span: 6
    },
    {
      label: '工单号',
      prop: 'workOrderNo',
      disabled: false,
      span: 6
    },
    {
      label: '客户',
      prop: 'customerName',
      disabled: false,
      span: 6
    },
    {
      label: '',
      prop: 'btn',
      span: 10,
      formslot: true
    }
  ]
};

const tableOption = {
  border: true,
  addBtn: false,
  viewBtn: false,
  editBtn: false,
  delBtn: false,
  index: true,
  menu: true,
  columnBtn: false,
  refreshBtn: false,
  indexLabel: '序号',
  column: [
    {
      label: '工单号',
      prop: 'workOrderNo',
      span: 7
    },
    {
      label: '产品编码',
      prop: 'productPartNo'
    },
    {
      label: '产品名称',
      prop: 'productPartName'
    },
    {
      label: '产品型号',
      prop: 'productPartModel'
    },
    {
      label: '客户',
      prop: 'customerName'
    },
    {
      label: '车间',
      prop: 'workshopName'
    },
    {
      label: '产线',
      prop: 'lineName'
    },
    {
      label: '产线派工数量',
      prop: 'planQuantity'
    },
    {
      label: '产线完工数量',
      prop: 'completedQuantity'
    },
    {
      label: '产线在制品数量',
      prop: 'wipQuantity'
    },
    {
      label: '停留时间（天）',
      prop: 'duration'
    }
  ]
};

const trendOption = {
  border: true,
  addBtn: false,
  viewBtn: false,
  editBtn: false,
  delBtn: false,
  menu: false,
  columnBtn: false,
  refreshBtn: false,
  column: [
    {
      label: '表头',
      prop: 'statisticalMonth',
      headerslot: true
    },
    {
      label: '0-7天',
      prop: 'quantity0To7',
      span: 7
    },
    {
      label: '7-14天',
      prop: 'quantity7To14'
    },
    {
      label: '14-30天',
      prop: 'quantity14To30'
    },
    {
      label: '30天以上',
      prop: 'quantityAbove30'
    },
    {
      label: '合计',
      prop: 'quantityTotal'
    },
    {
      label: '环比',
      prop: 'quantityRate',
      html: true,
      formatter: (val) => {
        if (val.quantityRate) {
          if (val.quantityRate.includes('-')) {
            return '<b style="color:#00aa00">' + val.quantityRate * 100 + '%' + '</b>';
          } else {
            return '<b style="color:red">' + val.quantityRate * 100 + '%' + '</b>';
          }
        }
      }
    }
  ]
};

const detailTableOption = {
  border: true,
  addBtn: false,
  viewBtn: false,
  editBtn: false,
  delBtn: false,
  index: true,
  menu: false,
  columnBtn: false,
  refreshBtn: false,
  indexLabel: '序号',
  column: [
    {
      label: '工序',
      prop: 'routeName'
    },
    {
      label: '数量',
      prop: 'quantity'
    }
  ]
};
const peiOption = {
  title: {
    text: '在制品数量占比',
    left: 'center',
    textStyle: {
      fontSize: 18,
      fontWeight: 'bold',
      color: '#333'
    }
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    bottom: '5%',
    left: 'center'
  },
  series: [
    {
      name: '',
      type: 'pie',
      radius: '50%',
      data: [
      ],
      label: {
        show: true,
        position: 'outside',
        formatter: '{b}: {d}%'
      },
      emphasis: {
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      }
    }
  ]
};

const barOption = {
  title: {
    text: '在制品停留时间分布图',
    left: 'center',
    textStyle: {
      fontSize: 18,
      fontWeight: 'bold',
      color: '#333'
    }
  },
  tooltip: {
    trigger: 'item',
    formatter: '点击柱状图可显示对应库龄的详细物料数据' // 提示内容格式
  },
  xAxis: {
    name: '库龄',
    type: 'category',
    data: ['0-7天', '7-14天', '14-30天', '30天以上']
  },
  yAxis: {
    name: '数量',
    type: 'value'
  },
  legend: {
    right: '5%',
    left: 'center'
  },
  series: [
    {
      data: [],
      type: 'bar',
      itemStyle: {
        color: '#5AAEF3' // 设置柱子的颜色
      },
      label: {
        show: true,
        position: 'top',
      },
    }
  ]
};
const lineOption = {
  title: {
    text: '在制品停留时间分布趋势',
    textStyle: {
      fontSize: 18,
      fontWeight: 'bold',
      color: '#333'
    },
    left: 'center'
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    data: ['0-7天', '7-14天', '14-30天', '30天以上'],
    right: '5%',
    bottom: '15%',
    orient: 'vertical'
  },
  grid: {
    left: '3%',
    right: '15%',
    bottom: '3%',
    containLabel: true
  },
  xAxis: {
    type: 'category',
    boundaryGap: false,
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      name: '0-7天',
      type: 'line',
      stack: 'Total',
      data: []
    },
    {
      name: '7-14天',
      type: 'line',
      stack: 'Total',
      data: []
    },
    {
      name: '14-30天',
      type: 'line',
      stack: 'Total',
      data: []
    },
    {
      name: '30天以上',
      type: 'line',
      stack: 'Total',
      data: []
    }
  ]
};
export { option, tableOption, peiOption, barOption, lineOption, detailTableOption, trendOption };
